<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="<%=basePath%>js/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="<%=basePath%>js/vue.min.js"></script>
<link rel="stylesheet" href="<%=basePath%>css/layui/css/layui.css">
<script type="text/javascript"
	src="<%=basePath%>js/stockManage/createPurchaseOrder.js"></script>
<script type="text/javascript" src="<%=basePath%>js/BaseUtile.js"></script>

</head>
<body style="margin: 3%">
	<div class="layui-form">
		<div style="text-align: center;font-size: 30px">填写采购订单</div>
<hr class="layui-bg-orange">

		<div style="">
			<div style="">
				<div id="supplierDiv" style="margin-top: 2%;width: 30%">
					<label class="layui-form-label">供货商</label>
					<div class="layui-input-block" >
						<select id="inputSupplier" >
							<option v-for="option in options"
								v-bind:value="option.userId">{{option.nickname}}</option>
						</select>
					</div>
				</div>
				<div style="margin-top: 2%;width: 30%">
					<label class="layui-form-label">应付账款</label>
					<div class="layui-input-block">
						<input id="inputTotalPrice" disabled="disabled"
							class="layui-input" />
					</div>
				</div>
			</div>

			<div style="margin-top: 2%">
				<div class="layui-inline" style="width: 30%">
					<label class="layui-form-label">采购日期</label>
					<div class="layui-input-block">
						<input id="inputPurchaseTime" class="layui-input" placeholder="年-月-日"/>
					</div>
				</div>
				<div class="layui-inline">
					<label class="layui-form-label">经手员工</label>
					<div class="layui-input-block" >
						<input  value="${userInfo.nickname}" disabled="disabled"
							class="layui-input" />
							<input id="inputCreateById" value="${userInfo.userId}" style="display: none"
							class="layui-input" />
					</div>
				</div>
			</div>

			<hr class="layui-bg-orange">

			<div style="margin-top: 3%; margin-bottom: 3%">
				<button class="layui-btn layui-btn-danger" id="chooseFoodButton">选择进货商品</button>
			</div>


		</div>

		<!-- 显示选择的进货商品 -->
		<div id="materialListData">
			<table class="layui-table">
				<thead>
					<tr>
						<th>序号</th>
						<th>商品</th>
						<th>数量</th>
						<th>单位</th>
						<th>进货单价</th>
						<th>金额</th>
						<th>操作</th>
					</tr>
				</thead>
				<tr v-for="(item ,index) in items">
					<th>{{index+1}}</th>
					<th>{{ item.materialName}}</th>
					<th>{{ item.materialQuantity}}</th>
					<th>{{ item.unitName}}</th>
					<th>{{ item.materialPrice}}</th>
					<th>{{ item.totalPrice}}</th>
					<th><button class="layui-btn layui-btn-sm"
							v-on:click="onclick(item,index)">删除</button></th>
				</tr>
			</table>
		</div>
		<!-- 备注 -->
		<div>
			<label class="layui-form-label">备注:</label>
			<textarea id="inputRemark" placeholder="请输入内容" class="layui-textarea"></textarea>
		</div>
		<div style="margin-top: 5%">
			<button id="submitButton" class="layui-btn layui-btn-fluid">提交采购申请</button>

		</div>

	</div>








	<script type="text/javascript" src="<%=basePath%>css/layui/layui.js"></script>
	<script>
		layui.use('form', function() {

		});

		//时间选择器
		layui.use('laydate', function() {
			var laydate = layui.laydate;
			//墨绿主题
			laydate.render({
				elem : '#inputPurchaseTime',
				theme : 'molv'
			});
		});
	</script>
</body>
</html>